<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Crest Design</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link href="css/style.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="scripts/jquery.js"></script>
<script type="text/javascript" src="scripts/jquery.min.js"></script>
<script type="text/javascript" src="scripts/cycle.js"></script>
<script type="text/javascript" src="scripts/jquery.prettyPhoto.js"></script>
<script type="text/javascript" src="scripts/custom.js"></script>
<script type="text/javascript" src="scripts/cufon.js"></script>
<script type="text/javascript" src="scripts/cufon.font.js"></script>
<script type="text/javascript" src="scripts/vcard.packed.js"></script>
<script type="text/javascript" src="scripts/vtip.js"></script>
<script type="text/javascript" src="scripts/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="scripts/init.js"></script>
<!--======================Scroller Start=============================-->



<!--======================Scroller END--===========================-->
<!--[if lt IE 8]><script> iexplorer = 1; </script><![endif]--><meta name="title" content="Crest Design" />
<meta name="description" content="description" />
<link rel="image_src" type=" image/jpeg" href="images/vcard/profile.jpg" />
<link rel="stylesheet" href="./css/prettyPhoto.css" type="text/css" media="screen"/>

</head>
   <body>

<!-- Wrapper --><div id="wrapper">
	<!-- Vcard --><div id="vcard">
		<div class="clearpx"></div>


<!-- Header -->
   <div id="header">
   	<div id="logo">Crest Design</div>
		<ul id="menu">
			<li class="active"><a href="#home">About me</a></li>
			<li><a href="#skills">Skills</a></li>
   			<li><a href="#work">Work</a></li>
   			<li><a href="#contact">Contact</a></li>
		</ul>
	</div><!-- End Header -->

	<hr/>

		<!-- Content --><div id="content">

<!-- Scroller -->
   <div id="scroller">
	<!-- Menu Home -->
	<div id="menu_home" class="contentitem">
		<div class="main">
			<div class="pagetitle">Crest Design - Welcome</div>
   <h1>‘Hello. My name is Ashraf Khan and I am a Designer.’ </h1>
   <p>I am a Graphic Web Designer & VFX Artist currently working with Asian<br> Buisness Exhibition & Confrences(ABEC). I am an graduate in commerce<br> from Mumbai University and multimdedia. I live in Mumbai with my family. </p>
	<p>In 2012 we started Crest Design with a mission to provide high quality<br> design services, We have the knowledge, experiance and the network to<br> meet the heighest expectations of our clients. To deliver that experience,<br> we have three criteria for each system we design. </p>
	<p>I invite you to<a class="button" href="#contact">Contact me</a> to let me know how i might help you.</p>
    <p>Ashraf Khan</p>
			</div>

	<div class="sidebar">
		<h2>I am Best in</h2>
			<ul>
				<li>Logo design</li>
				<li>Corporate identity</li>
				<li>Web design</li><br />
				<li>Graphic Design</li>
				<li>Video Editting/Compositing</li>
			</ul>

		<hr class="spacer"/>

		
		</div>
	</div><!-- End Menu Home -->

	<div id="menu_skills" class="contentitem">
			<div class="pagetitle">Crest Design - Skills</div>
				<div class="main">
		<h1>My skills</h1>
			
     
<ul class="no-style">
									<li>
										<div class="progress">
											<h4>Adobe Illustator</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="90%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">90%</span>
												</div>
											</div>
										</div>	
									</li>
									<li>
										<div class="progress">
											<h4>Adobe Photo Shop</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="80%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">80%</span>
												</div>
											</div>
										</div>
									</li>
									<li>
										<div class="progress">
											<h4>Adobe Indesign</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="85%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">85%</span>
												</div>
											</div>
										</div>
									</li>
									<li>
										<div class="progress">
											<h4>Adobe Dreamweaver</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="90%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">90%</span>
												</div>
											</div>
										</div>
									</li>
									<li>
										<div class="progress">
											<h4>Corel Draw</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="65%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">65%</span>
												</div>
											</div>
										</div>
									</li>
                                    <li>
										<div class="progress">
											<h4>Adobe Flash</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="75%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">70%</span>
												</div>
											</div>
										</div>
									</li>
                                    	<li>
										<div class="progress">
											<h4>HTML & CSS</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="80%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">80%</span>
												</div>
											</div>
										</div>	
									</li>
                                    	<li>
										<div class="progress">
											<h4>Adobe After Effect & Premier</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="70%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">70%</span>
												</div>
											</div>
										</div>	
									</li>
                                    
                                    <li>
										<div class="progress">
											<h4>3DS MAX</h4>
											<div class="progressBar">
												<div class="progressValue grayscale vtip" title="40%">
													<!-- The progress bar will automatically change when you change the value inside the span tag below. -->
													<!-- You can also override the value in the title attribue. -->
													<span title="">40%</span>
												</div>
											</div>
										</div>	
									</li>
								</ul>           
        
				</div>

		<div class="sidebar">

		<h2>My Experience</h2>
			<ul>	
			<li class="li-moreinfo">
				<div class="grid_4">
									<h3 class="title">Asian Buisness Exhibition & Confrences</h3>
									<h4 class="description1">Graphic Designer</h4>
									<h5 class="description2">August 2011 - Present</h5>
								</div></li>
                                
                                <li class="li-moreinfo">
                                
                                <div class="grid_4">
									<h3 class="title">Seventh Digit                          </h3>
									<h4 class="description1">Graphic and Web Designer</h4>
									<h4 class="description2">August 2010 - August 2011								</h4>
								</div>
				
			</li>
			</ul>
		</div>
	</div><!-- Menu Work -->

		<div id="menu_work" class="contentitem">
			<div class="pagetitle">Crest Design - My Work</div>

				<ul class="navigation" id="worknavigation">
					<li>here comes menu</li>
				</ul>
		<h1>Under Construction</h1>
		
		<!-- work mask --><div id="workmask">
				<div id="workscroller">
					<ul class="work">
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work1.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work2.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work3.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work4.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work5.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work6.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work1.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work2.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work3.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work4.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work5.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work6.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work1.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work2.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work3.jpg" alt="work1"/></a></li>
						<li><a href="./images/work/work1.jpg" class="work-item-preview" rel="prettyPhoto"><img src="./images/work/work4.jpg" alt="work1"/></a></li>
					</ul>
				</div>
		</div><!-- End work mask -->
	</div><!-- End menu work -->


		<!-- Menu Networks --><div id="menu_networks" class="contentitem">
			<div class="pagetitle">Crest Design - Networks</div>
		<h1>Let's connect...</h1>

			<ul class="networks">
				<li><a href="http://www.facebook.com" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/facebook.png" alt="facebook"/><span class="title"><span class="sname">Facebook</span><span class="surl"><br/>facebook.com/johndoe</span></span></span></a></li>
				<li><a href="http://www.flickr.com" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/flickr.png" alt="flickr"/><span class="title"><span class="sname">Flickr</span><span class="surl"><br/>flickr.com/johndoe</span></span></span></a></li>
				<li><a href="http://www.last.fm" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/lastfm.png" alt="lastfm"/><span class="title"><span class="sname">lastFM</span><span class="surl"><br/>last.fm/johndoe</span></span></span></a></li>
				<li><a href="http://www.twitter.com" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/twitter.png" alt="twitter"/><span class="title"><span class="sname">Twitter</span><span class="surl"><br/>twitter.com/johndoe</span></span></span></a></li>
				<li><a href="http://www.digg.com" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/digg.png" alt="digg"/><span class="title"><span class="sname">Digg</span><span class="surl"><br/>digg.com/johndoe</span></span></span></a></li>
				<li><a href="http://www.me.com" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/mobileme.png" alt="mobileme"/><span class="title"><span class="sname">MobileMe</span><span class="surl"><br/>me.com/johndoe</span></span></span></a></li>
				<li><a href="http://www.linkedin.com" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/linkedin.png" alt="linkedin"/><span class="title"><span class="sname">LinkedIn</span><span class="surl"><br/>linkedin.com/in/johndoe</span></span></span></a></li>
				<li><a href="http://www.vimeo.com" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/vimeo.png" alt="vimeo"/><span class="title"><span class="sname">Vimeo</span><span class="surl"><br/>vimeo.com/johndoe</span></span></span></a></li>
				<li><a href="http://www.myspace.com" target="_blank"><span class="background"></span><span class="content"><img src="images/networks/myspace.png" alt="myspace"/><span class="title"><span class="sname">MySpace</span><span class="surl"><br/>myspace.com/johndoe</span></span></span></a></li>
			</ul>
			</div><!-- End Menu Networks -->

		<!-- Menu Contact --><div id="menu_contact" class="contentitem">
			<div class="pagetitle">Crest Design - Let's chat</div>
				<div class="main contact">

		
			<div id="email_form">
            
					<iframe allowtransparency="true" src="http://www.jotform.me/form/20891070372450" frameborder="0" style="width:100%; height:400px; border:none;" scrolling="no">
</iframe>


			</div>
            <div id="contactRIGHT">
           	  <img src="images/vcard/contact.png"  /></div><!--contactRIGHT END-->
			
					<div id="email_send">
						<h2>Your email has been sent!</h2>
						<p>I'll get back to you as soon as possible.<br/>In the meanwhile check out my <a href="#networks">social network profiles</a>.</p>
					</div>
				</div>

				<div class="sidebar">	
			<h2>Crest Design</h2>
			<p>401 B (wing)<br/>Chandresh Mahal,<br/> Lodha Complex,<br/> Mira Roda (East)<br/><br/>Cell: +323 4987373<br/>
            Email: <a href="mailto:khanashraf27@gmail.com">khanashraf27@gmail.com</a><br/></p><hr class="spacer" />
            
            
       <a href="images/CV_Ashraf Khan.doc" target="_blank" class="grayscale vtip" title="Download Resume" >
										<span><img src="images/icons/grayscale/save_download_32.png" alt="" /></span>
									</a>
        
        
        
	</div>
 	</div><!-- End Menu Contact -->
	</div><!-- End Scroller -->
	</div><!-- End Content -->
	</div>
	<!-- End Vcard -->
	</div><!-- End Wrapper -->


</body>
</html>